import { Table, Tag, Space } from 'antd';
import { useState } from 'react';



export default function StudentsCompletionTable({ data }) {
  const [fileterFinish, setFilterFinish] = useState(null);


  const columns = [
    {
      title: '学号',
      dataIndex: 'id',
      key: 'id'
    },
    {
      title: '姓名',
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: '专业',
      dataIndex: 'discipline',
      key: 'discipline',
    },
    {
      title: '年级',
      dataIndex: 'grade',
      key: 'grade',
    },
    {
      title: '完成情况',
      key: 'finish',
      dataIndex: 'finish',
      render: finish => {
        let color;
        switch (finish) {
          case "未完成":
            color = "red"
            break;
          case "已完成":
            color = "green"
            break;
          default:
            color = 'orange';
            break;
        }
        return (
          <Tag color={color} key={finish}>
            {finish}
          </Tag>
        );
      },
    },
  ];

  const handleChange = (pagination, filters, sorter) => {
    setFilterFinish(filters)
  }


  return (
    <Table columns={columns} dataSource={data} pagination={false} onChange={handleChange} />
  );
}
